﻿@model SAIM.Models.ColumnData
@Scripts.Render("~/bundles/jqueryval")

<div class="form-group">
    @Html.LabelFor(m => m.Required, new { @class = "col-sm-3 control-label" })
    <div class="col-sm-9">
        @Html.HiddenFor(m => m.Required)
        <label class="radio-inline"><input type="radio" name="IsRequired" data-name="Required" data-value="True">@SAIM.Resources.Site.Yes</label>
        <label class="radio-inline"><input type="radio" name="IsRequired" data-name="Required" data-value="False" checked>@SAIM.Resources.Site.No</label>
    </div>
</div>
@switch (Model.DataType)
{
    case "Text":
        @*<div class="form-group">
            @Html.LabelFor(m => m.Unique, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                @Html.HiddenFor(m => m.Unique)
                <label class="radio-inline"><input type="radio" name="IsUnique" data-name="Unique" data-value="True">@SAIM.Resources.Site.Yes</label>
                <label class="radio-inline"><input type="radio" name="IsUnique" data-name="Unique" data-value="False" checked>@SAIM.Resources.Site.No</label>
            </div>
        </div>*@
        <div class="form-group">
            <label class="col-sm-3 control-label" for="email">@SAIM.Resources.Site.Description</label>
            <div class="col-sm-9">
                @Html.TextAreaFor(m => m.Description, new { @class = "form-control", @style = "resize:none; min-height:71px;", @rows = "2" })
                @Html.ValidationMessageFor(m => m.Description)
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.DefaultValue, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <input class="form-control" data-val="true" id="DefaultValue" name="DefaultValue" value="" type="text">
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.Size, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <input class="form-control" id="Size" name="Size" value="" type="text" placeholder="@SAIM.Resources.Site.Automatic" min="1" max="255" >
            </div>
        </div>
        break;
    case "Choice":
        <div class="form-group">
            <label class="col-sm-3 control-label" for="email">@SAIM.Resources.Site.Description</label>
            <div class="col-sm-9">
                @Html.TextAreaFor(m => m.Description, new { @class = "form-control", @style = "resize:none; min-height:71px;", @rows = "2" })
                @Html.ValidationMessageFor(m => m.Description)
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.DefaultValue, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <input class="form-control" data-val="true" id="DefaultValue" name="DefaultValue" value="" type="text">
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.Choices, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <textarea class="form-control" style="resize:none; min-height:71px;" data-val="true" data-val-required="@SAIM.Resources.Validations.AtLeastOneChoice" id="Choices" name="Choices" rows="2"></textarea>
                <span class="field-validation-valid text-danger" data-valmsg-for="Choices" data-valmsg-replace="true"></span>
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.ChoiceType, new { @class = "col-sm-3 control-label" })
            @Html.HiddenFor(m => m.ChoiceType)
            <div class="choice-type col-sm-9">
                <div class="radio">
                    <label><input type="radio" name="Type" data-value="DropDown" checked>Drop-Down Menu</label>
                </div>
                <div class="radio">
                    <label><input type="radio" name="Type" data-value="Radio">Radio Buttons</label>
                </div>
                <div class="radio">
                    <label><input type="radio" name="Type" data-value="Checkbox">Checkboxes (Multiple)</label>
                </div>
                <span class="field-validation-valid text-danger" data-valmsg-for="ChoiceType" data-valmsg-replace="true"></span>
            </div>
        </div>
        <script type="text/javascript">
            $('#ChoiceType').val('DropDown');
            $("#Choices").rules("add", {
                required : true,
                messages: {
                    required: $("#Choices").data('val-required')
                }
            });
            $('.choice-type > .radio > label > input').bind('click', function () {
                $('#ChoiceType').val($(this).data('value'));
            });
        </script>
        break;
    case "Integer":
        <div class="form-group">
            <label class="col-sm-3 control-label" for="email">@SAIM.Resources.Site.Description</label>
            <div class="col-sm-9">
                @Html.TextAreaFor(m => m.Description, new { @class = "form-control", @style = "resize:none; min-height:71px;", @rows = "2" })
                @Html.ValidationMessageFor(m => m.Description)
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.DefaultValue, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <input class="form-control" data-val="true" id="DefaultValue" name="DefaultValue" value="" type="text">
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.MinSize, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <input class="form-control" data-val="true" data-val-number="@SAIM.Resources.Validations.Number" id="MinSize" name="MinSize" placeholder="@SAIM.Resources.Site.Automatic" type="text">
                @Html.ValidationMessageFor(m => m.MinSize, "", new { @class = "text-danger" })
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.MaxSize, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <input class="form-control" data-val="true" data-val-number="@SAIM.Resources.Validations.Number" id="MaxSize" name="MaxSize" placeholder="@SAIM.Resources.Site.Automatic" type="text">
                @Html.ValidationMessageFor(m => m.MaxSize, "", new { @class = "text-danger" })
            </div>
        </div>
        <script type="text/javascript">
            $("#MinSize").rules("add", "number");
            $("#MaxSize").rules("add", "number");
        </script>
        break;
    case "Decimal":
        <div class="form-group">
            <label class="col-sm-3 control-label" for="email">@SAIM.Resources.Site.Description</label>
            <div class="col-sm-9">
                @Html.TextAreaFor(m => m.Description, new { @class = "form-control", @style = "resize:none; min-height:71px;", @rows = "2" })
                @Html.ValidationMessageFor(m => m.Description)
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.DefaultValue, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <input class="form-control" data-val="true" id="DefaultValue" name="DefaultValue" value="" type="text">
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.MinSize, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <input class="form-control" data-val="true" data-val-number="@SAIM.Resources.Validations.Number" id="MinSize" name="MinSize" placeholder="@SAIM.Resources.Site.Automatic" type="text">
                @Html.ValidationMessageFor(m => m.MinSize, "", new { @class = "text-danger" })
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.MaxSize, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <input class="form-control" data-val="true" data-val-number="@SAIM.Resources.Validations.Number" id="MaxSize" name="MaxSize" placeholder="@SAIM.Resources.Site.Automatic" type="text">
                @Html.ValidationMessageFor(m => m.MaxSize, "", new { @class = "text-danger" })
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.DecimalPlaces, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <input class="form-control" data-val="true" data-val-number="@SAIM.Resources.Validations.Number" id="DecimalPlaces" name="DecimalPlaces" placeholder="@SAIM.Resources.Site.Automatic" type="text">
                @Html.ValidationMessageFor(m => m.DecimalPlaces, "", new { @class = "text-danger" })
            </div>
        </div>
        <script type="text/javascript">
            $("#MinSize").rules("add", "number");
            $("#MaxSize").rules("add", "number");
            $("#DecimalPlaces").rules("add", "number");
        </script>
        break;
    case "Date":
        @Styles.Render("~/Content/datetimepicker")
        <div class="form-group">
            <label class="col-sm-3 control-label" for="email">@SAIM.Resources.Site.Description</label>
            <div class="col-sm-9">
                @Html.TextAreaFor(m => m.Description, new { @class = "form-control", @style = "resize:none; min-height:71px;", @rows = "2" })
                @Html.ValidationMessageFor(m => m.Description)
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.DefaultValue, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <div id="datetimepicker" class="input-group date" data-provide="datepicker">
                    <input class="form-control" data-val="true" id="DefaultValue" name="DefaultValue" value="" type="text">
                    <div class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </div>
                </div>
            </div>
        </div>
        @Scripts.Render("~/bundles/datetimepicker")
        <script type="text/javascript">
            $("#datetimepicker").datetimepicker({
                format: 'YYYY/MM/DD',
                widgetPositioning: {
                    horizontal: 'auto',
                    vertical: 'top'
                },
                locale: 'es'
            });
        </script>
        break;
    case "Time":
        @Styles.Render("~/Content/datetimepicker")
        <div class="form-group">
            <label class="col-sm-3 control-label" for="email">@SAIM.Resources.Site.Description</label>
            <div class="col-sm-9">
                @Html.TextAreaFor(m => m.Description, new { @class = "form-control", @style = "resize:none; min-height:71px;", @rows = "2" })
                @Html.ValidationMessageFor(m => m.Description)
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.DefaultValue, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <div id="datetimepicker" class="input-group date" data-provide="datepicker">
                    <input class="form-control" data-val="true" id="DefaultValue" name="DefaultValue" value="" type="text">
                    <div class="input-group-addon">
                        <span class="glyphicon glyphicon-time"></span>
                    </div>
                </div>
            </div>
        </div>
        @Scripts.Render("~/bundles/datetimepicker")
        <script type="text/javascript">
            $("#datetimepicker").datetimepicker({
                format: 'H:mm:ss',
                widgetPositioning: {
                    horizontal: 'auto',
                    vertical: 'top'
                },
                locale: 'es'
            });
        </script>
        break;
    case "DateTime":
        @Styles.Render("~/Content/datetimepicker")
        <div class="form-group">
            <label class="col-sm-3 control-label" for="email">@SAIM.Resources.Site.Description</label>
            <div class="col-sm-9">
                @Html.TextAreaFor(m => m.Description, new { @class = "form-control", @style = "resize:none; min-height:71px;", @rows = "2" })
                @Html.ValidationMessageFor(m => m.Description)
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.DefaultValue, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <div id="datetimepicker" class="input-group date" data-provide="datepicker">
                    <input class="form-control" data-val="true" id="DefaultValue" name="DefaultValue" value="" type="text">
                    <div class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </div>
                </div>
            </div>
        </div>
        @Scripts.Render("~/bundles/datetimepicker")
        <script type="text/javascript">
            $("#datetimepicker").datetimepicker({
                format: 'YYYY/MM/DD H:mm:ss',
                widgetPositioning: {
                    horizontal: 'auto',
                    vertical: 'top'
                },
                locale: 'es'
            });
        </script>
        break;
    case "Hiperlink":
        <div class="form-group">
            <label class="col-sm-3 control-label" for="email">@SAIM.Resources.Site.Description</label>
            <div class="col-sm-9">
                @Html.TextAreaFor(m => m.Description, new { @class = "form-control", @style = "resize:none; min-height:71px;", @rows = "2" })
                @Html.ValidationMessageFor(m => m.Description)
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.DefaultValue, new { @class = "col-sm-3 control-label" })
            <div class="col-sm-9">
                <input class="form-control" data-val="true" id="DefaultValue" name="DefaultValue" value="" type="text">
            </div>
        </div>
        break;
}

<script type="text/javascript">
    $(function () {
        jQuery.extend(jQuery.validator.messages, {
            required: "@SAIM.Resources.Validations.FieldRequired",
            remote: "@SAIM.Resources.Validations.Remote",
            email: "@SAIM.Resources.Validations.Email",
            url: "@SAIM.Resources.Validations.Url",
            date: "@SAIM.Resources.Validations.Date",
            dateISO: "@SAIM.Resources.Validations.DateISO",
            number: "@SAIM.Resources.Validations.Number",
            digits: "@SAIM.Resources.Validations.Digits",
            equalTo: "@SAIM.Resources.Validations.EqualTo",
            accept: "@SAIM.Resources.Validations.Accept",
            maxlength: jQuery.validator.format("@SAIM.Resources.Validations.MaxLength"),
            minlength: jQuery.validator.format("@SAIM.Resources.Validations.MinLength"),
            rangelength: jQuery.validator.format("@SAIM.Resources.Validations.RangeLength"),
            range: jQuery.validator.format("@SAIM.Resources.Validations.Range"),
            max: jQuery.validator.format("@SAIM.Resources.Validations.Max"),
            min: jQuery.validator.format("@SAIM.Resources.Validations.Min")
        });

        $('.radio-inline input').bind('click', function () {
            if ($(this).data('name') === 'Unique') {
                $('#Unique').val($(this).data('value'));
            }
            else if ($(this).data('name') === 'Required') {
                $('#Required').val($(this).data('value'));
            }
        });
    });
</script>
